<template>
    <Poptip
            confirm
            class="poptip"
            title="您确定要删除这些任务吗？"
            :disabled="noData"
            transfer
            placement="top"
            @on-ok="confirm"
            @on-cancel="cancel">
        <Button type="error" @click="prefixClick" :disabled="noData">
            <Icon type="md-trash" :size="16" class="position_i"/>批量删除
        </Button>
    </Poptip>
</template>

<script>
    export default {
        name: 'batch-remove',
        props: {
            dataNum: { // 选中的待删除的数据数量
                type: Number,
                default: 0
            }
        },
        data() {
            return {
            }
        },
        computed: {
            noData() {
                return this.dataNum <= 0
            }
        },
        mounted() {
        },
        methods: {
            // 点击确认的操作
            confirm() {
                this.$emit('on-ok')
            },
            // 点击取消的操作
            cancel() {
                this.$emit('on-cancel')
            },
            // 点击批量删除的操作
            prefixClick() {
                if (this.noData) { // 没有数据可以删除时
                    this.$Message.warning('请先选择任务')
                }
            }
        },
        beforeDestroy() {
        },
        watch: {}
    }
</script>

<style scoped>
    .position_i {
        position: relative;
        top: -1px;
        margin-right: 5px;
    }
    .poptip>>>.ivu-poptip-popper {
        width: max-content;
        max-width: 300px;
    }
</style>